<template>
	<div class="settings">
		<div class="shopcart_header">
			<img src="../assets/images1/rightbut.png" alt="" @click="back()"/>
			<p>个人资料</p>
		</div>
		<div>
			<div class="info_item">
				<mt-cell title="个人头像">
					<img src="../assets/car_03.jpg" width="24" height="24">
					<img src="../assets/images1/return.png" alt="" />
				</mt-cell>
			</div>
			<div class="info_item">
				<mt-cell title="昵称">
					<img src="../assets/images1/return.png" alt="" />
				</mt-cell>

			</div>
			<div class="info_item" @click="openPicker">
				<mt-cell title="生日">
					{{pickerValue}}
					<mt-datetime-picker ref="picker" type="date" year-format="{value} 年" month-format="{value} 月" date-format="{value} 日" v-model="pickerValue">
					</mt-datetime-picker>
					<img src="../assets/images1/return.png" alt="" />
				</mt-cell>
			</div>

			</mt-cell>
			<mt-cell title="性别">
				<img src="../assets/images1/return.png" alt="" />
			</mt-cell>
			</mt-cell>
			<mt-cell title="地区">
				<img src="../assets/images1/return.png" alt="" />
				<span></span>
			</mt-cell>
		</div>

	</div>
</template>

<script>
	import { DatetimePicker } from 'mint-ui';
	export default {

		data() {
			return {
				pickerValue: null,
			}
//			Vue.filter('moment', function (value, formatString) {
//			    formatString = formatString || 'YYYY-MM-DD HH:mm:ss';
//			    return moment(value).format(formatString);
//			});
		},
	
		methods: {
			openPicker() {
				this.$refs.picker.open();
				
			},
			back(){
				this.$router.push({
					path:'/settings'
				})
			}
			

		}
		


	}
</script>

<style scoped="scoped">
	.shopcart_header {
		width: 100%;
		height: 1.2rem;
		border-bottom: 1px solid gainsboro;
		display: flex;
		align-items: center;
		background: white;
		justify-content: flex-start;
	}
	
	.shopcart_header img {
		width: 5%;
		margin-left: 2%;
	}
	
	.shopcart_header p {
		margin-left: 35%;
		font-size: 0.4rem;
		font-weight: bold;
	}
	
	.personal-time {
		border-top: 1px solid #cccccc;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
	}
</style>